<style lang="scss" scoped>
.container {
  background-size: 100% 100%;
  width: 3.75rem;
  height: 6.67rem;
  text-align: center; //实现元素水平居中
  .header {
    width: 3.75rem;
    height: 0.45rem;
    line-height: 0.45rem;
    background-color: #f2f2f2;
    color: rgba(16, 16, 16, 1);
    font-size: 0.18rem;
    text-align: center;
  }
  .login {
    padding: 0.5rem 0 1.5rem;
    p {
      line-height: 0.35rem;
      font-size: 0.24rem;
      color: #ffffff;
    }
    button {
      width: 2.95rem;
      height: 0.4rem;
      line-height: 0.26rem;
      border-radius: 0.03rem;
      background-color: rgba(255, 152, 0, 1);
      color: rgba(255, 255, 255, 1);
      font-size: 0.18rem;
      text-align: center;
      margin: 0 0.4rem;
    }
  }
}
</style>

<template>
    <div class="container">
        <div class="header">用户登录</div>        
        <div class="login">
            <div class="logo">
                <img src="/static/doctor.png" />
            </div>
            <Form ref="formLogin" :model="formLogin" >
                <FormItem prop="username">
                    <Input type="text" v-model="formLogin.username" placeholder="用户名/邮箱" >
                        <Icon type="ios-person-outline" slot="prepend"></Icon>
                    </Input>
                </FormItem>
                <FormItem prop="password">
                    <Input type="password" v-model="formLogin.password" placeholder="登陆密码" name="password" @keyup.enter="login">
                        <Icon type="ios-locked-outline" slot="prepend"></Icon>
                    </Input>
                </FormItem>
                  <FormItem >
                        <Button type="primary" @click="login" style="background-color:#008573" >登录</Button>
                    </FormItem>
            </Form>                                 
        </div>
    <div class="footer">
        <img src="/static/bottom.png" />
    </div>
    </div>   
</template>

<script>
export default {
  name: "loginInfo",
  data() {
    return {
      formLogin: {
        username: "",
        password: ""
      }
    };
  },
  methods: {
    login() {
       this.$router.push("/index");
    }
  }
};
</script>


